<!DOCTYPE html>
<style>
  @font-face {
    font-family: 'myahem';
    src: url(../../../resources/Ahem.ttf);
  }
  text {
    font-family: 'myahem';
  }
</style>
<svg width="100" height="100">
  <text id="ref" x="15 65" y="10 20" fill="red">A B C</text>
  <text id="target" x="15" y="10 20" fill="green">A B C</text>
  <text id="source" x="50" y="50 60" fill="blue">X Y Z</text>
</svg>
<script src="../../../resources/run-after-layout-and-paint.js"></script>
<script src="../resources/text-based-repaint.js"></script>
<script>
testIsAsync = true;
window.onload = runRepaintAndPixelTest;

function repaintTest() {
    var moved = document.querySelector('#source').y.baseVal.removeItem(1);
    document.querySelector('#target').x.baseVal.appendItem(moved);

    runAfterLayoutAndPaint(function() {
        moved.value = 65;
        finishRepaintTest();
    });
}
</script>
